<template>
  <div class="card-box-20 fl-1">
    <span>{{ $t('public.hello') }}</span>
    <!-- <span>{{name}}</span>
    <span>{{ $filters.parseTime(new Date() ) }}</span>
    <span>{{ $t('public.hello')}}</span>
    <el-input v-model="name" type="textarea" v-input-fixed="{ set(val){name = val}}"></el-input>

    <div v-drag-dialog>
      <el-dialog v-model="dialogVisible" title="Tips" width="30%">
        <span>This is a message</span>
        <template #footer>
          <span class="dialog-footer">
            <el-button @click="dialogVisible = false">Cancel</el-button>
            <el-button type="primary" @click="dialogVisible = false">Confirm</el-button>
          </span>
        </template>
      </el-dialog>
    </div>

    <el-button @click="handleGo">跳转路由</el-button>
    <el-button @click="dialogVisible = true">打开弹窗</el-button>
    <el-button @click="handleTest">测试</el-button> -->
    <!-- <Editor v-model="name" /> -->
    <el-button @click="dialogVisible = true">打开弹窗</el-button>
    <div>
      <el-dialog v-model="dialogVisible" draggable title="Tips" width="30%">
        <span>This is a message</span>
        <template #footer>
          <span class="dialog-footer">
            <el-button @click="dialogVisible = false">Cancel</el-button>
            <el-button
              type="primary"
              @click="dialogVisible = false"
            >Confirm</el-button>
          </span>
        </template>
      </el-dialog>
    </div>
  </div>
</template>

<script lang="ts">
import { defineComponent, reactive, toRefs } from 'vue';
import router from '@/router';
export default defineComponent({
  name: 'HomeIndex',
  setup() {
    const data = reactive({
      name: '1',
      dialogVisible: false,
    });
    const handleGo = (): void => {
      router.push('/home/edit');
    };
    return {
      ...toRefs(data),
      handleGo,
    };
  },
});
</script>

<style lang="scss" scoped></style>
